<template>
  <Card title="最新充值" v-bind="$attrs">
    <template #extra>
      <a-button type="link" size="small" @click="pageJump('/datas/recharge')">更多</a-button>
    </template>
    <List item-layout="horizontal" :data-source="dynamicInfoItems">
      <template #header>
        <a-row type="flex" >
          <a-col :span="6">充值金额</a-col>
<!--          <a-col :span="4">　服务费</a-col>-->
          <a-col :span="6">付款户名</a-col>
          <a-col :span="6">付款帐号</a-col>
          <a-col :span="6">充值时间</a-col>
        </a-row>
      </template>
      <template #renderItem="{ item }">
        <ListItem>
          <ListItemMeta>
            <template #title>
              <a-row type="flex" >
                <a-col :span="6">{{parseFloat(item.amount).toFixed(2)}}</a-col>
<!--                <a-col :span="4">{{item.serviceFee}}</a-col>-->
                <a-col :span="6">{{item.paymentAccountName}}</a-col>
                <a-col :span="6">{{item.paymentAccount}}</a-col>
                <a-col :span="6">{{item.receiptTime}}</a-col>
              </a-row>
            </template>
          </ListItemMeta>
        </ListItem>
      </template>
    </List>
  </Card>
</template>
<script lang="ts" setup>
  import { onMounted, ref } from "vue";
  import { Card, List } from "ant-design-vue";
  import { useRouter } from "vue-router";
  import { queryIndexNewList } from "/@/api/sys/business.api";

  const router = useRouter()
  const ListItem = List.Item;
  const ListItemMeta = List.Item.Meta;
  const dynamicInfoItems = ref<any>([]);

  onMounted(async () => {
    //查询商户信息
    await queryIndexNewList({}).then((res) => {
      dynamicInfoItems.value = res.result;
    });
  });

  function pageJump(url){
    router.push({ path: url})
  }

</script>
